<html>
<head>
<template id="shadow-template">
<div style="color: red;"><h1>Hello from the shadow dom!</h1></div>
</template>
</head>
<body onload="addShadowDOM()">
<div id="element_in_an_iframe"></div>
<script>
function addShadowDOM() {
    var host = document.getElementById("element_in_an_iframe").attachShadow({mode: 'open'});
    var template = document.querySelector("#shadow-template");
    host.appendChild(template.content);
    template.remove();
}
</script>
</body>
</html>
